<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml"
      xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>公司信息修改</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-store, must-revalidate">
    <meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
    <meta http-equiv="expires" content="-1">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
          name="viewport">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="/dist/img/icon.png" type="image/x-icon">
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="/dist/plugins/bootstrap/css/bootstrap.min.css">
    <!--字体-->
    <link rel="stylesheet" href="/dist/css/font-awesome.min.css">
    <!--图标-->
    <link rel="stylesheet" href="/dist/css/ionicons.min.css">
    <!--插件样式-->
    <link href="/dist/plugins/ztree/css/zTreeStyle/zTreeStyle.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/dist/plugins/webuploader-0.1.5/webuploader.css">
    <!--OA主样式-->
    <link rel="stylesheet" href="/dist/css/OA.min.css?t=f5a12a1d">
    <link rel="stylesheet" href="/dist/css/skins/OA-skins.min.css?t=16f1e6f3">
    <style>
        .model-picker-input {
            opacity: 0 !important;
            top: -9999px;
            left: -9999px;
            position: absolute;
        }

        .model-picker-span {
            position: relative;
            display: block;
            outline: 0;
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
            border-bottom: 1px solid #ccc;
            background-color: #fff;
            color: #ccc;
            cursor: pointer;
        }

        .model-picker-span > .placeholder {
            color: #aaa;
        }

        .model-picker-span.focus,
        .model-picker-span.open {
            border-bottom-color: #46A4FF;
        }

        .model-picker-span.open > .arrow {
            background-position: -10px -10px;
        }

        .model-picker-span > .title > span {
            color: #333;
            padding: 5px;
            border-radius: 3px;
        }

        .model-picker-span > .title > span:hover {
            background-color: #f1f8ff;
        }

        .model-picker-dropdown {
            position: absolute;
            width: 315px;
            left: -9999px;
            top: -9999px;
            outline: 0;
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
            z-index: 999999;
            display: none;
            min-width: 200px;
            margin-bottom: 20px;
            margin-top: 5px;
        }

        .model-select-wrap {
            box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
        }

        .model-select-tab {
            border-bottom: 1px solid #ccc;
            background: #f5f5f5;
            font-size: 13px;
        }

        .model-select-tab > a {
            display: inline-block;
            padding: 4px 20px;
            border-left: 1px solid #ccc;
            border-bottom: 1px solid transparent;
            color: #4D4D4D;
            text-align: center;
            outline: 0;
            text-decoration: none;
            cursor: pointer;
            font-size: 14px;
            margin-bottom: -1px;
        }

        .model-select-tab > a.active {
            background: #fff;
            border-bottom: 1px solid #fff;
            color: #46A4FF;
        }

        .model-select-tab > a:first-child {
            border-left: none;
        }

        .model-select-tab > a:last-child.active {
            border-right: 1px solid #ccc;
        }

        .model-select-content {
            width: 100%;
            min-height: 50px;
            background-color: #fff;
            padding: 5px 5px;
        }

        .model-select {
            font-size: 16px;
        }

        .model-select dl {
            line-height: 2;
            clear: both;
            padding: 3px 0;
            margin: 0;
            max-height: 200px;
            overflow-y: scroll;
        }

        .model-select dt {
            position: absolute;
            width: 2.5em;
            font-weight: 500;
            text-align: right;
            line-height: 2;
        }

        .model-select dd {
            margin-left: 0;
            line-height: 2;
        }

        .model-select.province dd {
            margin-left: 3em;
        }

        .model-select a {
            display: inline-block;
            padding: 0 10px;
            outline: 0;
            text-decoration: none;
            white-space: nowrap;
            margin-right: 2px;
            text-decoration: none;
            color: #333;
            cursor: pointer;
        }

        .model-select a:hover,
        .model-select a:focus {
            background-color: #f1f8ff;
            border-radius: 2px;
            color: #46A4FF;
        }

        .model-select a.active {
            background-color: #46A4FF;
            color: #fff;
            border-radius: 2px;
        }

        .table-detail input[type=text] {
            padding-left: 0 !important;
            text-indent: 0 !important;
        }

        .span-a-btn {
            position: absolute;
            right: 5px;
        }

        label {
            display: inline-block;
            max-width: 100%;
            margin: 0;
            font-weight: normal;
            font-size: 14px;
            margin-right: 12px !important;
        }

        label input {
            float: left;
            margin-top: 12px !important;
            margin-right: 2px !important;
            width: 15px;
            height: 15px;
        }

        .table-detail td {
            font-size: 16px;
            line-height: 29px;
            height: 39px;
            border-right: 1px solid #cbcbcb;
            border-bottom: 1px solid #cbcbcb;
        }

        .table-detail td.td-row3 {
            height: 70px;
            line-height: 18px;
            max-height: 70px;
            overflow: hidden;
            position: relative;
        }

        .yuying {
            position: absolute;
            right: 10px;
            bottom: 10px;
            width: 20px;
            height: 20px;
            background: url("/dist/img/yuyin.png");
            background-size: cover;
            cursor: pointer;
        }

        input {
            text-align: left !important;
        }

        .table-detail td.td-value {
            text-align: left !important;
            padding-left: 6px !important;
            font-size: 16px !important;
        }

        .table-detail td.td-value select {
            margin-left: -5px !important;
            padding-left: 0px !important;
            color: #2a8cec !important;
        }

        .btn-group-xs > .btn, .btn-xs {
            padding: 1px 5px;
            font-size: 16px;
            line-height: 1.5;
            border-radius: 3px;
        }

        .table-detail textarea {
            height: 60px;
            width: 100%;
            border: none;
            outline: none;
            -webkit-appearance: none;
            resize: none;
            line-height: 20px;
            padding-top: 2px !important;
            padding-left: 0px;
        }

        .td-row3 span {
            max-height: 60px;
            line-height: 20px;
            overflow: hidden;
            /*text-overflow: ellipsis;*/
            /*display: -webkit-box;*/
            /*-webkit-box-orient: vertical;*/
            /*-webkit-line-clamp: 3;*/
            display: inline-block;
            width: 228px;
            text-align: left;
            color: #2a8cec !important;
            font-size: 12px !important;

        }

        .div-td-content-more {
            position: absolute;
            height: auto;
            z-index: 999;
            line-height: 20px;
            background-color: #d3e8fd;
            padding: 8px 6px;
            border: 1px solid #e8e8ea;
            display: none;
        }

        .div-td-content-more i {
            width: 15px;
            height: 12px;
            background: url("/dist/img/more-icon.png");
            position: absolute;
            left: 50px;
            top: -12px;
        }

        .td-module td {
            color: #333;
            font-weight: bold;
        }

        .table-detail {
            border-left: 1px solid #cbcbcb;
            border-top: 1px solid #cbcbcb;
        }

        .table-detail .td-module {
            background-color: #ebebeb;
        }

        .wyui-autocomplete-panel li a {
            font-size: 12px;
        }

        .select.user {
            color: #000;
            background-color: #9bcaef;
        }

        .user {
            height: 30px;
            line-height: 30px;
            max-height: 30px;
            float: left;
            text-align: left;
            min-width: 32px;
            padding-left: 1px;
            overflow: hidden;
            cursor: pointer;
        }

        .jiaobiao, .jiaobiaoNew {
            position: relative;
        }

        .jiaobiao i {
            display: block;
            width: 0;
            height: 0;
            border-width: 0px 0 12px 12px;
            border-style: solid;
            border-color: transparent transparent transparent #2a8cec;
            position: absolute;
            top: 0px;
            left: 0px;
        }

        table .td-title {
            background-color: #f8f8f8;
            line-height: 24px;
            font-weight: bold;
        }

        .biTian {
            position: absolute;
            left: 2px;
            top: 10px;
            color: red;
        }

        .test-textarea {
            width: 400px;
            min-height: 26px;
            line-height: 20px;
            _height: 30px;
            /* max-height: 150px;*/
            margin-left: auto;
            margin-right: auto;
            padding: 3px;
            outline: 0;
            border: 1px solid #ccc;
            font-size: 12px;
            word-wrap: break-word;
            overflow-x: hidden;
            overflow-y: auto;
            -webkit-user-modify: read-write-plaintext-only;
            border-radius: 4px;
        }

        .vEdit {
            width: 100%;
            height: 100%;
            word-break: break-all;
            outline: none;
            user-select: text;
            white-space: pre-wrap;
            text-align: left;
            color: #2a8cec !important;
            font-size: 14px;
        }

        .td-row3 .vEdit span {
            color: #2a8cec !important;
            font-size: 12px;
            float: left;
        }

        .vEdit[contenteditable=true] {
            user-modify: read-write-plaintext-only;
        }

        .vEdit:empty:before {
            content: attr(placeholder);
            display: block;
            color: #ccc;
        }

        .vEdit {
            height: 100%;
            padding: 5px 0;
        }

        .td-value span.lineOne {
            overflow: hidden;
            text-overflow: ellipsis;
            color: black !important;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
        }

        .td-value {
            text-align: left !important;
            vertical-align: middle;
            word-wrap: break-word;
            color: black !important;
        }

        .td-value span {
            display: inline-block;
            overflow: hidden;
            padding-left: 0.06rem;
            word-wrap: break-word;
            color: black !important;
        }

        .div-td-content-more {
            position: absolute;
            height: auto;
            z-index: 999;
            background-color: #d3e8fd;
            padding: 0.08rem 0.06rem;
            border: 0.01rem solid #e8e8ea;
            display: none;
            overflow: hidden;
        }

        .div-td-content-more i {
            width: 0.15rem;
            height: 0.12rem;
            background: url("/dist/img/more-icon.png");
            position: absolute;
            left: 0.5rem;
            top: -.12rem;
        }

        .a-btn {
            color: black;
        }
    </style>
</head>
<body>
<iframe id="ifAttach" style="display:none"></iframe>
<div class="div-td-content-more"><i></i></div>
<section class="content" id="app" v-cloak style="padding:0px;">
    <div class="div-td-content-more"><i></i></div>
    <div id="div" style="margin-top: 12px">
        <div style="float: left">
            <div class="center" style="width: 400px">
                <table class="table-detail">
                    <tr>
                        <td class="td-title" style="width: 38%;">公司简称</td>
                        <td class="td-value" style="width:62%;">
                            <input v-if="pageType!='browser'" type="text" v-model="searchParams.company.name"/>
                            <span v-else>{{searchParams.company.name}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-title">公司全称</td>
                        <td class="td-value">
                            <input v-if="pageType!='browser'" type="text" v-model="searchParams.company.allName"/>
                            <span v-else>{{searchParams.company.allName}}</span>
                        </td>
                    </tr>
                    <!--<tr>-->
                    <!--<td class="td-title">父级公司名</td>-->
                    <!--<td class="td-value">-->
                    <!--<select v-if="pageType!='browser'" v-model="searchParams.company.parentId"-->
                    <!--style=" padding-left: 19px;">-->
                    <!--<option v-for="option in parentCompanyList" v-bind:value="option.id">-->
                    <!--{{option.name}}-->
                    <!--</option>-->
                    <!--</select>-->
                    <!--<span v-else>{{searchParams.company.parentCompanyName}}</span>-->

                    <!--</td>-->
                    <!--</tr>-->
                    <tr>
                        <td class="td-title">公司电话</td>
                        <td class="td-value">
                            <input v-if="pageType!='browser'" type="text"
                                   v-model="searchParams.company.fixedTelephone"/>
                            <span v-else>{{searchParams.company.fixedTelephone}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-title">传真</td>
                        <td class="td-value">
                            <input v-if="pageType!='browser'" type="text"
                                   v-model="searchParams.company.fax"/>
                            <span v-else>{{searchParams.company.fax}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-title">省</td>
                        <td class="td-value">
                            <input v-if="pageType!='browser'" type="text"
                                   v-model="searchParams.company.province"/>
                            <span v-else>{{searchParams.company.province}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-title">市</td>
                        <td class="td-value">
                            <input v-if="pageType!='browser'" type="text"
                                   v-model="searchParams.company.city"/>
                            <span v-else>{{searchParams.company.city}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-title">省会</td>
                        <td class="td-value">
                            <input v-if="pageType!='browser'" type="text"
                                   v-model="searchParams.company.provincialCapital"/>
                            <span v-else>{{searchParams.company.provincialCapital}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-title">代理品牌</td>
                        <td class="td-value">
                            <input v-if="pageType!='browser'" type="text" v-model="searchParams.company.brand"/>
                            <span v-else>{{searchParams.company.brand}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-title">可售品牌</td>
                        <td class="td-value">
                            <span>{{searchParams.company.availableBrands}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-title ">税号</td>
                        <td class="td-value">
                            <input v-if="pageType!='browser'" type="text" v-model="searchParams.company.taxId"/>
                            <span v-else>{{searchParams.company.taxId}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-title">公司地址</td>
                        <td class="td-value">
                            <textarea v-if="pageType!='browser'" v-model="searchParams.company.address"></textarea>
                            <span v-else>{{searchParams.company.address}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td-title" colspan="2" style="background: #d3e8fd;color: black;">仓储地址信息
                            <span class="span-a-btn" v-if="pageType!='browser'">
                <a href="javascript:void(0);" class="a-btn"
                   @click="addRow('stockList','stockList')">添加库存地</a>
                </span></td>
                    </tr>
                    <template v-for="(item,i) in searchParams.stockList">
                        <tr>
                            <td class="td-title" style="width: 153px;">库存地址({{number2big(i+1)}})</td>
                            <td class="td-value">
                                <input v-if="pageType!='browser'&&item.stockArea=='直发客户交机'" readonly="readonly"
                                       type="text" v-model="item.stockArea" style="width: 85%;"/>
                                <input v-else-if="pageType!='browser'" type="text" v-model="item.stockArea"
                                       style="width: 85%;"/>
                                <span v-else class="lineOne">{{item.stockArea}}</span>
                                <i v-if="item.stockArea!='直发客户交机'&&pageType!='browser'" class="fa fa-fw fa-minus"
                                   style="position: absolute;right: 10px;top:12px;cursor: pointer;color:red;"
                                   @click="delRow('stockList',i)"></i>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-title">联系人</td>
                            <td class="td-value">
                                <input v-if="pageType!='browser'" type="text" v-model="item.contact"/>
                                <span v-else class="lineOne">{{item.contact}}</span>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-title">联系人电话</td>
                            <td class="td-value">
                                <input v-if="pageType!='browser'" type="text" v-model="item.contactTel"/>
                                <span v-else class="lineOne">{{item.contactTel}}</span>
                            </td>
                        </tr>
                    </template>
                    <!--运输公司配置-->
                    <tr>
                        <td class="td-title" colspan="2" style="background: #d3e8fd;color: black;">运输公司信息
                            <span class="span-a-btn" v-if="pageType!='browser'">
                <a href="javascript:void(0);" class="a-btn"
                   @click="addRow('transportList','transportList')">添加运输公司</a>
                </span></td>
                    </tr>
                    <template v-for="(item,i) in searchParams.transportList">
                        <tr>
                            <td class="td-title" style="width: 153px;">运输公司({{number2big(i+1)}})</td>
                            <td class="td-value">
                                <input v-if="pageType!='browser'" type="text" v-model="item.transportCompany"/>
                                <span v-else class="lineOne">{{item.transportCompany}}</span>
                                <i v-if="pageType!='browser'" class="fa fa-fw fa-minus"
                                   style="position: absolute;right: 10px;top:12px;cursor: pointer;color:red;"
                                   @click="delRow('transportList',i)"></i>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-title" style="width: 153px;">联系人</td>
                            <td class="td-value">
                                <input v-if="pageType!='browser'" type="text" v-model="item.contact"/>
                                <span v-else class="lineOne">{{item.contact}}</span>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-title">联系人电话</td>
                            <td class="td-value">
                                <input v-if="pageType!='browser'" type="text" v-model="item.contactTel"/>
                                <span v-else class="lineOne">{{item.contactTel}}</span>
                            </td>
                        </tr>
                    </template>
                    <!--开户行配置-->
                    <tr>
                        <td class="td-title" colspan="2" style="background: #d3e8fd;color: black;">公司开户行信息
                            <span class="span-a-btn" v-if="pageType!='browser'">
                <a href="javascript:void(0);" class="a-btn"
                   @click="addRow('bankList','bankList')">添加开户行</a>
                </span></td>
                    </tr>
                    <template v-for="(item,i) in searchParams.bankList">
                        <tr>
                            <td class="td-title" style="width: 153px;">开户行({{number2big(i+1)}})</td>
                            <td class="td-value">
                                <input v-if="pageType!='browser'" type="text" v-model="item.bankName"/>
                                <span v-else class="lineOne">{{item.bankName}}</span>
                                <i v-if="pageType!='browser'" class="fa fa-fw fa-minus"
                                   style="position: absolute;right: 10px;top:12px;cursor: pointer;color:red;"
                                   @click="delRow('bankList',i)"></i>
                            </td>
                        </tr>
                        <tr>
                            <td class="td-title">账号</td>
                            <td class="td-value">
                                <input v-if="pageType!='browser'" type="text" v-model="item.bankCard"/>
                                <span v-else class="lineOne">{{item.bankCard}}</span>
                            </td>
                        </tr>
                    </template>
                </table>
            </div>
        </div>

    </div>
    <div class="south no-print" style="height:50px;line-height:50px;text-align:center;">
        <input type="button" style="margin-left:20px;" v-if="pageType=='edit'"
               value="保存" class="btn btn-primary oaBtn btn-sm" @click="update()"/>
        <input type="button" style="margin-left:20px;" v-if="pageType=='add'"
               value="提交" class="btn btn-primary oaBtn btn-sm" @click="add()"/>
    </div>
</section>

</body>
<!--JQ-->
<script src="https://file.ggxqce.com/web/jquery-2.2.3.min.js"></script>
<!--插件JS-->
<script src="https://file.ggxqce.com/web/bootstrap.min.js"></script>
<script src="Template.js?t=42e28def"></script>

<!--框架已定义 JS-->
<script src="/dist/js/app_iframe.js?t=0b5caf39"></script>
<!--oa自定义  JS-->
<script src="/dist/js/oa.js?t=0c4d95a9"></script>
<script type="text/javascript" src="/dist/plugins/My97DatePicker/WdatePicker.js"></script>
<script src="https://file.ggxqce.com/web/vue.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("body").on("click", ".td-value", function (e) {
            if ($(".div-td-content-more").is(":hidden")) {
                var text = $(this).text();
                if (text != "") {
                    text = "<i></i>" + text;
                    $(".div-td-content-more").html(text).css({
                        "width": $(this).outerWidth() + "px",
                        "left": $(this).offset().left,
                        "top": ($(this).offset().top + $(this).outerHeight()) + "px"
                    }).show();
                    e.stopPropagation();
                }
            } else {
                $(".div-td-content-more").hide();
            }

        });
        $("body").on("click", ".div-td-content-more", function (e) {
            e.stopPropagation();
        });
        $("body").on("click", function () {
            $(".div-td-content-more").hide();
        });
    });

</script>
<script type="text/javascript">
    var api = frameElement.api, W = api.opener;
    var app = new Vue({
        el: '#app',
        data: {
            pageType: $.wyui.page.urlParams.pageType,
            parentCompanyList: [],
            searchParams: {
                stockList: [
                    {
                        companyId: '',
                        stockArea: '直发客户交机',
                        contact: '',
                        contactTel: ''
                    }

                ],
                bankList: [
                    {
                        companyId: '',
                        bankName: '',
                        bankCard: '',
                    }

                ],
                transportList: [
                    {
                        companyId: '',
                        transportCompany: '',
                        contact: '',
                        contactTel: ''
                    }

                ],
                company: {
                    id: '',
                    name: '',
                    delFlag: '0',
                    createUserId: getCurrentUser().id,
                    parentCompanyName: '',
                    parentId: '',
                    updateUserId: getCurrentUser().id,
                    allName: '',
                    fixedTelephone: '',
                    provincialCapital: '',
                    taxId: '',
                    address: '',
                    brand: '',
                    province: '',
                    city: '',
                    fax:''
                }
            }
        },
        methods: {
            add: function () {
                var that = this;
                $.wyui.postMethod('/company/add.json', trimRN(that.searchParams), function (r) {
                    if (r.addNewId > 0) {
                        alert("添加成功")
                        var $iframe = top.findIframeByName("公司管理");
                        $iframe[0].contentWindow.refresh();
                        api.close();
                    } else {
                        alert("添加失败")
                    }

                });
            },

            update: function () {
                var that = this;
                $.wyui.postMethod('/company/update.json', trimRN(that.searchParams), function (r) {
                    if (r.isOk) {
                        alert("保存成功")
                        var $iframe = top.findIframeByName("公司管理");
                        $iframe[0].contentWindow.refresh();
                        api.close();
                    } else {
                        alert("保存失败")
                    }

                });
            },
            number2big: function (number) {
                switch (Number(number)) {
                    case 1:
                        return '一';
                        break;
                    case 2:
                        return '二';
                        break;
                    case 3:
                        return '三';
                        break;
                    case 4:
                        return '四';
                        break;
                    case 5:
                        return '五';
                        break;
                    case 6:
                        return '六';
                        break;
                    case 7:
                        return '七';
                        break;
                    case 8:
                        return '八';
                        break;
                    case 9:
                        return '九';
                        break;
                    case 10:
                        return '十';
                        break;
                }
            },
            addRow: function (prop, template) {
                console.log(prop);
                this.searchParams[prop].push(new Template[template]());
            },
            delRow: function (prop, index) {
                this.searchParams[prop].splice(index, 1);
            }
        },
        mounted: function () {
            var that = this;
            var stockInit = [{companyId: '', stockArea: '直发客户交机', contact: '', contactTel: ''}]
            var transportInit = [{companyId: '', transportCompany: '', contact: '', contactTel: ''}]
            var bankInit = [{companyId: '', bankName: '', bankCard: '',}]
            $.wyui.postMethod('/company/getCompanyList.json', {}, function (r) {
                that.parentCompanyList = r
            });
            if ($.wyui.page.urlParams.pageType != 'add') {
                $.wyui.postMethod('/company/getCompanyById.json', {id: $.wyui.page.urlParams.id}, function (r) {
                    that.searchParams.company = r.company;
                    if (r.transportList.length > 0) {
                        that.searchParams.transportList = r.transportList;
                    } else {
                        that.searchParams.transportList = transportInit;
                    }
                    if (r.bankList.length > 0) {
                        that.searchParams.bankList = r.bankList;
                    } else {
                        that.searchParams.bankList = bankInit;
                    }
                    if (r.stock.length > 0) {
                        that.searchParams.stockList = r.stock;
                    } else {
                        that.searchParams.stockList = stockInit;
                    }
                });
            }

        }

    })


</script>

</html>